<template>
    <div>
        <div>
            <el-button
                
                @click="all"
            >刷新</el-button>
        </div>
        <el-table
            :data="tableData"
            style="width: 100%"
        >

            <el-table-column
                property="id"
                label="序号"
                width="180"
            >
            </el-table-column>

            <el-table-column
                    label="日期"
                    width="180"
                    property="date"
            >
            <template slot-scope="scope">
                <i class="el-icon-time"></i>
                <span style="margin-left: 10px">{{ scope.row.date }}</span>
            </template>
            </el-table-column>

            <el-table-column
                property="typeId"
                label="类别编号"
                width="180"
            >
            </el-table-column>

            <el-table-column
                property="number"
                label="数量"
                width="180"
            >
            </el-table-column>

            <el-table-column
                property="value"
                label="积分值"
                width="180"
            >
            </el-table-column>

        </el-table>
    </div>
</template>

<script>
import axios from 'axios'
export default {
    name: 'onlySuccess',

    data () {
        return {
            tableData: [{
                id: '',
                date: '',
                typeId: '',
                number: '',
                value: ''
            }]
        }
    },

    mounted () {
        this.all()//每次进入该页面自动执行该方法，即自动读取数据库数据导入到页面当中
    },

    methods: {
        all () {
            axios.get('http://localhost/select_success').then(res => {
                this.tableData = res.data;//数据传递到页面数组
                console.log("数据查询成功" + res.data)

            }).catch(err => {
                console.log("获取数据失败" + err);
            })
        }

    },
};
</script>

<style lang="scss" scoped>
</style>
